import React, {Component} from 'react';
import {View, Text, Button, Image, TextInput} from 'react-native';
import {StackActions, NavigationActions} from 'react-navigation';
import {Avatar, ListItem, Input} from 'react-native-elements';
import {serverUrl} from '../../app.json';
import axios from 'axios';

export default class DetailsScreen extends Component {
    constructor(props) {
        super(props);
        this.state = {
            data: [],
        };
        this.fetchData = this.fetchData.bind(this);
    }

    static navigationOptions = ({navigation, navigationOptions}) => {
        return {
            title: navigation.getParam('name', '个人中心'),
        };
    };

    fetchData() {
        axios.get(serverUrl + '/getUserById/{id}?id=5d483231e9f7191950affd17')
            .then(function (response) {
                console.log(response.data);
                this.setState({
                    data: response.data,
                });
            })
            .catch(function (error) {
                console.log(error);
            });
    }

    componentDidMount() {
        this.fetchData();
    }

    render() {
        const list = [
            {
                name: 'Amy Farha',
                avatar_url: 'https://s3.amazonaws.com/uifaces/faces/twitter/ladylexy/128.jpg',
                subtitle: 'Vice President',
            },
            {
                name: 'Chris Jackson',
                avatar_url: 'https://s3.amazonaws.com/uifaces/faces/twitter/adhamdannaway/128.jpg',
                subtitle: 'Vice Chairman',
            },
        ];
        return (
            <View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
                {
                    list.map((l, i) => (
                        <ListItem style={{
                            flex: 1,
                            flexDirection: 'row',
                            justifyContent: 'center',
                            alignItems: 'center',
                            alignSelf: 'center',
                        }}
                                  key={i}
                                  leftAvatar={{source: {uri: l.avatar_url}}}
                                  title={l.name}
                                  subtitle={l.subtitle}
                                  rightElement={<TextInput style={{width: 50}} value={'123'}></TextInput>}
                        />
                    ))
                }
            </View>
        );
    }
}
